<template>
  <a-modal
    :maskClosable="maskClosable"
    title="迁出资源"
    :width="600"
    :visible="visible"
    :confirm-loading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭"
  >
    <a-spin :spinning="confirmLoading">
      <a-form :form="form" :labelCol="labelCol" :wrapperCol="wrapperCol">
        <!-- <a-form-item
          label="迁移对象"
        >
        </a-form-item> -->
        <a-form-item
          label="目标数据中心"
        >
          <a-select
            :getPopupContainer="
                triggerNode => {
                  return triggerNode.parentNode || document.body;
                }"
            v-decorator="[
              'datacenterId',
              {
                rules: [{ required: true, message: '请选择目标数据中心' }],
              },
            ]"
            @change="loadNodeList"
          >
            <a-select-option
              v-for="t in datacenterList"
              :key="t.id"
              :value="t.id"
            >
              {{ t.name }}
            </a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item
          label="目标服务器"
        >
          <a-select
            :getPopupContainer="
                triggerNode => {
                  return triggerNode.parentNode || document.body;
                }"
            v-decorator="[
              'nodeId',
              { rules: [{ required: true, message: '请选择目标服务器' }] },
            ]"
          >
            <a-select-option v-for="t in nodeList" :key="t.id" :value="t.id">
              {{ t.name }}
            </a-select-option>
          </a-select>
        </a-form-item>
      </a-form>
    </a-spin>
  </a-modal>
</template>
<script>
import { gPostAction } from "@/api/manage";
export default {
  name: "TransferModal",
  data() {
    return {
      visible: false,
      confirmLoading: false,
      form: this.$form.createForm(this),
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 7 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 14 },
      },
      radioStyle: {},
      datacenterList: [],
      nodeList: [],
      maskClosable: false,
    };
  },
  methods: {
    loadDatacenterList(record) {
      gPostAction("/asset/pageDatacenter", {}).then((res) => {
        this.datacenterList = res.data.list;
        if (this.datacenterList.length) {
          this.datacenterId = this.datacenterList[0].id;
          this.form.setFieldsValue({
            datacenterId: res.data.list[0].id,
          });
          this.loadNodeList(res.data.list[0].id, record);
        }
      });
    },
    loadNodeList(id, record) {
      let _that=this;
      gPostAction("/model/pageDeviceScore",
        {
          datacenterId: id,
          pageSize: 99,
          isolation: false,
          isIllness: false,
          modelType: "OPTIMAL_COST",
        }).then((res) => {
        this.nodeList = []
        this.form.setFieldsValue({
          nodeId: "",
        });
        if (res.success) {
          const data = res.data;
          if (data && data.list) {
            data.list=data.list.filter(t=>t.id!==_that.model.id);
            if (data.list && data.list.length) {
              this.nodeList = data.list.filter(item => item.id !== record.id)
              this.form.setFieldsValue({
                nodeId: this.nodeList[0].id,
              });
            }
            else {
              this.$message.warn("此数据中心下不存在可迁移的服务器，请选择其他数据中心")
            }
          }
        }
      });
    },
    tranfer(record) {
      this.model = Object.assign({}, record);
      this.loadDatacenterList(record);
      // this.loadNodeList();
      this.visible = true;
    },
    handleOk(e) {
      this.form.validateFields((err, values) => {
        if (!err) {
          this.confirmLoading = true;
          const postData = {
            srcNodeId: this.model.id,
            dstNodeId: values.nodeId,
          };
          gPostAction("/scheduler/migrate_resource", postData)
            .then((res) => {
              if (res.success) {
                this.$message.success("操作成功");
                this.$emit("ok");
              }
            })
            .finally(() => {
              this.confirmLoading = false;
              this.handleCancel();
            });
        }
      });
    },
    handleCancel(e) {
      this.visible = false;
    },
  },
};
</script>
